<template>
	<view class="page">
		<view>
			<text>当前wifi：</text>
			<input type="text" v-model="wifi_name" placeholder="">
		</view>
		<view>
			<text>密码</text>
			<input type="text" v-model="password" placeholder="输入wifi密码">
		</view>
		<button @click="send">发送</button>
		<view v-for="(item,index) in msg" :key="item">{{item}}</view>
	</view>
</template>

<script>  
	export default {
		data() {
			return {
				wifi_name:'abc123',
				password:'123',
				udpSocket:null,
				infoList: [],
				msg:[],
				port:'',
				new_data:''
			}
		},
		async onLoad() {
			let _this=this;
			uni.getConnectedWifi({
				partialInfo:true,
				success(res) {
					console.log(res)
					_this.wifi_name=res.wifi.SSID;
				}
			}) 
			
			this.udpSocket= wx.createUDPSocket();
			console.log(this.udpSocket)
			this.port = this.udpSocket.bind() 
			console.log('port',this.port)
			this.udpSocket.onListening((res) => {
			  console.log('onListening',res);
			})
			this.udpSocket.onMessage((res) => {
				console.log('onMessage',res);
				this.new_data=res.message;
				// this.$store.dispatch('new_socket_data', JSON.parse(res.message))
			})
		},
		async onShow() {
			 
		},
		onReachBottom(){
			 
		},
		onUnload() {
			this.udpSocket.close();
		},
		onHide() {
			this.udpSocket.close();
		},
		methods: {
			sen(){
				// 初始化TCP实例
				        this.tcp = wx.createTCPSocket()
				        // tcp实例向服务端发起连接
				        this.tcp.connect({ address: '192.168.10.1', port: 5050 })
				        this.infoList.push(`向192.168.10.1:5050建立链接`)
				
				        this.tcp.onClose(() => {
				          this.infoList.push('关闭')
				          this.tcp.close()
				        })
				        this.tcp.offClose(() => {
				          this.infoList.push('offClose')
				        })
				        this.tcp.onConnect(() => {
				          this.infoList.push('连接成功')
				        })
				        this.tcp.offConnect(() => {
				          this.infoList.push('offConnect')
				        })
				        this.tcp.onError(error => {
				          this.infoList.push('异常:' + error)
				        })
				        this.tcp.onMessage(data => {
				          // data是一个对象，服务端发送的数据在message属性里，且message微信这边得到的是一个ArrayBuffer格式的数据，所以需要转换一下
				          this.infoList.push('接收到数据: ' + transitionArrayBufferToString(data.message))
				        }) 
			},
			send(){
				console.log(123)
				let data={
					wifi_name:this.wifi_name,
					password:this.password,
					port:this.port
				}
				// uni.request({
				// 	url:'http://192.168.10.1:5050',
				// 	data:data,
				// 	method:'POST',
				// 	dataType:'json',
				// 	success(res) {
				// 		console.log('http://192.168.10.1:5050',res)
				// 	},
				// 	fail(err) {
				// 		console.log(err)
				// 	}
					
				// })
				
				// return
				console.log('JSON.stringify(data)', )
				this.udpSocket.send({
				  address: '255.255.255.255',
				  port: 6060, //你需要发送的端口号
				  message:JSON.stringify(data) //你需要发送的信息
				})
				this.udpSocket.onError((err) => {
				  console.log('onError',err)
				}) 
				console.log('已发送')
			},
			test(msg){
				console.log(msg)
			}
			
		},
		computed:{
			new_msg(){
				return this.$store.state.new_msg
			} 
		},
		watch:{
			new_data(newer,older){
				console.log('数据更新',newer)
				let unit8Arr = new Uint8Array(newer)
				console.log('unit8Arr',unit8Arr)
				if(newer!=older){
					this.msg.push(unit8Arr)
				}
			},
			new_msg(newer,older){
				console.log('数据更新')
				if(newer!=older){
					this.msg.push(newer)
				}
			} 
		},
		components: { 
		}
	}
</script>

<style lang="less" scoped>
	 
</style>
